<template>
  <div class="task-todo push-list">
    <van-search v-model="keywords" placeholder="搜索" @search="onRefresh" />
    <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
      <van-list
        v-model="loading"
        :finished="finished"
        finished-text="没有更多了"
        @load="onLoad"
      >
        <div class="gm-list-card" v-for="item in list" :key="item.TaskID">
          
          <van-cell class="gm-list-card-header" :title="item.SerialNum">
            <span>审批中</span>
          </van-cell>
          <van-cell @click="cellClick(item)">
            <div class="cont-title van-ellipsis">
              {{ item.ProcessName }}
            </div>
            <ul class="cont-desc">
              <li>申请人：{{ item.OwnerDisplayName }}</li>
              <li>申请时间：{{ item.ReceiveAt }}</li>
              <li>摘要：{{ item.Description || "无" }}</li>
            </ul>
          </van-cell>
          <van-cell class="gm-list-card-footer">
            
          </van-cell>
        </div>
      </van-list>
    </van-pull-refresh>

    <transfer-popup
      v-model="transferPopupShow"
      :active-data="activeData"
      @confirm="onRefresh()"
    />

    <van-popup v-model="show"  class="iframe-box" position="right" :style="{ width: '100%',height:'100%' }">
       <van-nav-bar
        title="采购协助"
        left-text="返回"
        left-arrow
        @click-left="ProcessPop"
      />
      <iframe
          :src="formUrl"
          frameborder="0"
          class="iframe-formpanel"
          width="100%"
          height="100%"
          scrolling="yes"
          name="processform"
        ></iframe>
    </van-popup>
  </div>
</template>

<script>
import { Pad_MyTaskYQCJXZ } from "../../api/index";
export default {
  name: "RepairReport",
  data() {
    return {
      show: false,
      keywords: "",
      // 数据
      list: [],
      // 下拉刷新loading
      refreshing: false,
      // 上拉加载loading
      loading: false,
      // 数据全部加载完成
      finished: false,
      //列表分页
      taskPageCtrl: {
        page: 1,
        size: 5,
      },
      // 弹窗显示
      transferPopupShow: false,
      // 当前项
      activeData: {},
    };
  },
  components: {
    "transfer-popup": () =>
      import("../../components/service/TransferPopup.vue"),
  },
  methods: {
    // 刷新
    onRefresh() {
      this.refreshing = true;
      this.finished = false;
      // 重新加载数据
      this.loading = true;
      this.onLoad();
    },
    onLoad() {
      if (this.refreshing) {
        // 清空列表数据
        this.list = [];
        this.taskPageCtrl = {
          page: 1,
          size: 5,
        };
        this.refreshing = false;
      }

      if (!this.finished) {
        const params = {
          Page: this.taskPageCtrl.page,
          Number: this.taskPageCtrl.size,
          KeyWords: this.keywords,
        };

        Pad_MyTaskYQCJXZ(params)
          .then((res) => {
            // 加载状态结束
            this.loading = false;
            if (res.ReturnResult === "1") {
              this.list.push(...res.ReturnData.children);
              // 数据全部加载完成
              if (this.list.length === res.ReturnData.total) {
                this.finished = true;
              }
              this.taskPageCtrl.page++;
            } else {
              this.$notify(res.Message);
            }
          })
          .catch((err) => {
            this.$notify(err);
          });
      }
    },
    handleOpenTransfer(item) {
      this.activeData = item;
      this.transferPopupShow = true;
    },
    cellClick:function(item){
      this.show = true;   
      this.formUrl=item.URL;
    },
    ProcessPop:function(){
        this.show = false;
    }
  },
  mounted() {
    let $this = this;
    window.addEventListener("message", function (e) {
      var i = 0;
      if (e.data.cmd !== undefined && e.data.cmd === "yzback") {
        if (i == 0) {
          $this.onRefresh();
          $this.ProcessPop();
          // $this.$emit("closeReload", $this.typeName);
        }
        i++;
      }
    });
  }
};
</script>

<style>

.iframe-formpanel {
  flex: 1;
  width: 100%;
}
.iframe-box {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  height: calc(100vh - env(safe-area-inset-bottom))!important;
  overflow: hidden;
}
</style>
